﻿/* ====== #css-name {background-image:url(../name5.png), url(../name0.png);background-repeat:no-repeat;background-position-x: 5px, 0px;background-position-y: 5px, 0px;background-size: 5%, 311px 69px;} ======  */
/* ====== allgemein ======  */

.haupt {padding:0px;}
#breite {width:90%;}
.hpname {padding-left:31px;font-size:20px;line-height: 26px;color:#32372D;letter-spacing:15px;text-shadow: 1px 1px 2px #fff;}
#hpname1 {height:22px;text-align:left;vertical-align:middle;padding-left : 0px;padding-right : 20px;}

body {
background-image:url(../images/background/schwarz_50.png);background-repeat:repeat;background-position: 0% 0%;background-attachment:fixed;
margin-bottom:11px;margin-top: 11px;
font-family : verdana,arial, helvetica, tahoma, verdana, sans-serif;
font-size: 15px;line-height: 25px;
}

/* überschriften */
h1, h2, h3, h4, h5, h6 {font-weight:normal;}
h1{text-align:left;margin-bottom:39px;letter-spacing:-1px;font-size: 22px;}
h2{text-align:left;margin-bottom:29px;letter-spacing:4px;font-size: 18px;}
h3 {text-align:left;margin-bottom:4px;letter-spacing:1px;font-size: 16px;}

/* ====== kopf und inhalt ======  */

#oben1_headbox_text {padding-bottom:11px;padding-right:11px;}
.headbox {width:100%;padding:1px;}
.headbox_inhalt {height:100%;width:100%;}
.headbox_text {padding-right:22px;
	border-radius: 20px 0px 20px 20px;
	background-position: 98%, 98%, 0px 25%, 75%, 0px;
	background-image:url(../images/logo/prohete_slogan_ro.png), url(../images/logo/nicetoseeyou_ro.png), url(../images/background/schwarz_50.png);background-repeat:no-repeat, no-repeat, repeat;text-align:justify;
	-moz-border-radius-topright:0px;-moz-border-radius-bottomleft:20px;-moz-border-radius-bottomright:20px;
	-webkit-border-top-left-radius:20px;-webkit-border-top-right-radius:0px;-webkit-border-bottom-left-radius:20px;-webkit-border-bottom-right-radius:20px;
}

.text {height:auto;width:100%;vertical-align:top;padding:1px;}
.text_inhalt {height:100%;width:100%;color:#7F7F7F;text-shadow: 1px 1px 1px #000;}
.textbox {height:100%;font-size: 15px;line-height: 25px;
background-image:url(../images/background/schwarz_50.png);background-repeat:repeat;background-position: 0% 0%;
padding-top: 40px;padding-bottom: 40px;padding-left:40px;padding-right:40px;text-align:justify;
border: 0px
-moz-border-radius-topleft:20px;-moz-border-radius-topright:20px;-moz-border-radius-bottomleft:20px;-moz-border-radius-bottomright:20px;
-webkit-border-top-left-radius:20px;-webkit-border-top-right-radius:20px;-webkit-border-bottom-left-radius:20px;-webkit-border-bottom-right-radius:20px;
border-top-left-radius:20px;border-top-right-radius:20px;border-bottom-left-radius:20px;border-bottom-right-radius:20px;
}

/* ====== animation beim logo ======  */
   #bewegung {-webkit-animation-name: bewegung;-webkit-animation-duration: 11s;}@-webkit-keyframes bewegung  {from  {-webkit-transform: translateX(0) rotate(0deg);}to {-webkit-transform: translateX(1750px) rotate(0deg);}}
   #bewegung{-moz-animation-name: bewegung;-moz-animation-duration: 11s;}@-moz-keyframes bewegung  {from  { -moz-transform: translateX(0) rotate(0deg);}to {-moz-transform: translateX(1750px) rotate(0deg);}}
   #bewegung{-ms-animation-name: bewegung;-ms-animation-duration: 11s;}@-ms-keyframes bewegung  {from  { -ms-transform: translateX(0) rotate(0deg);}to {-ms-transform: translateX(1750px) rotate(0deg);}}
/* ====== animation auf header-grafik ======  */
   @keyframes fadein{from{opacity:0;}to{opacity:1;}}@-moz-keyframes fadein{from{opacity:0;}to{opacity:1;}}@-webkit-keyframes fadein{from{opacity:0;}to{opacity:1;}}@-o-keyframes fadein{from{opacity:0;}to{opacity:1;}}
   @keyframes fadeout{from{opacity:1;}to{opacity:0;}}@-moz-keyframes fadeout{from{opacity:1;}to{opacity:0;}}@-webkit-keyframes fadeout{from{opacity:1;}to{opacity:0;}}@-o-keyframes fadeout{from{opacity:1;}to{opacity:0;}}
/* ====== animation FadeInOut ======  */
   .animatedOut {background-image: url(..//images/logo/prohete_logo_g.png);background-repeat: no-repeat;background-position: 0px 0px;background-size: 245px 70px;padding-top:71px;margin-bottom:25px;-webkit-animation-duration: 11s;animation-duration: 11s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
      @-webkit-keyframes fadeOut {0% {opacity: 0;}25% {opacity: 0,5;}50% {opacity: 1;}75% {opacity: 0,5;}100% {opacity: 0;}}
      @keyframes fadeOut {0% {opacity: 0;}25% {opacity: 0,5;}50% {opacity: 1;}75% {opacity: 0,5;}100% {opacity: 0;}}
      .fadeOut {-webkit-animation-name: fadeOut;animation-name: fadeOut;}
   .animatedIn {background-image: url(..//images/logo/prohete_logo_o.png);background-repeat: no-repeat;background-position: 0px 0px;background-size: 245px 70px;padding-top:71px;margin-bottom:25px;-webkit-animation-duration: 20s;animation-duration: 20s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
      @-webkit-keyframes fadesIn {0% {opacity: 0;}25% {opacity: 0;}50% {opacity: 00;}75% {opacity: 0,25;}100% {opacity: 1;}}
      @keyframes fadesIn {0% {opacity: 0;}25% {opacity: 0;}50% {opacity: 00;}75% {opacity: 0,25;}100% {opacity: 1;}}
      .fadesIn {-webkit-animation-name: fadesIn;animation-name: fadesIn;}